@import "partials/mixins";
#flow {
	.bg {
		height: ptr(8829px); // background: url('~img/flow.jpg') center ptr(-140px) no-repeat;
		background-size: 100% 100%
	}
	.chart {
		width: 100%;
		height: ptr(540px);
	}
	.box {
		padding: 0 ptr(15px) ptr(15px) ptr(15px);
		background-color: #fff;
		margin-bottom: ptr(20px);
		.boxHead {
			height: ptr(80px);
			border-bottom: 1px solid #F0F0F0;
			margin-bottom: ptr(40px);
			.title {
				font-size: ptr(32px);
				position: relative;
				margin-left: ptr(30px);
				&::before {
					content: '';
					width: ptr(10px);
					height: ptr(36px);
					display: block;
					position: absolute;
					left: ptr(-20px);
					top: ptr(5px);
					background-color: #41C0C1;
					border-radius: ptr(5px);
				}
			}
			.unitText {
				color: #919191;
				padding-left: ptr(10px);
				font-size: ptr(20px);
			}
			.open {
				color: #4DC5C4;
				width: ptr(150px);
				.open_icon {
					height: ptr(50px);
					width: ptr(50px);
					background: url("~img/open_icon.png") no-repeat center center;
					background-size: ptr(98px) ptr(77px);
				}
				.close_icon {
					height: ptr(50px);
					width: ptr(50px);
					background: url("~img/close_icon.png") no-repeat center center;
					background-size: ptr(98px) ptr(77px);
				}
			}
		}
	}
	.chartTitle {
		font-size: ptr(32px);
		padding: ptr(10px);
		padding-left: ptr(20px);
	}
	.flowTypeDWMYData {
		padding-top: ptr(35px);
		padding-bottom: ptr(30px);
		margin-bottom: ptr(25px);
		text-align: center;
		.number {
			font-size: ptr(60px);
			color: #41C0C1;
			padding-top: ptr(10px);
			height: ptr(70px);
		}
		.text {
			font-size: ptr(28px);
			height: ptr(70px);
			padding-top: ptr(12px);
			color: #999;
		}
		.borderBottom {
			padding: ptr(10px) 0;
			border-bottom: 1px solid #ccc;
		}
		.borderRight {
			border-right: 1px solid #ccc;
		}
	}
	.flowTrendChartSameRing {
		.rchart {
			width: 100%;
			height: ptr(600px);
		}
		.bottom {
			height: ptr(50px);
			line-height: ptr(50px);
			text-align: center;
			color: #999;
			font-size: ptr(28px);
		}
	}
	.FlowActivity {
		.chart2 {
			height: ptr(300px);
		}
	}
	.flowHotSpotTimeTopThree {
		padding-bottom: ptr(15px);
		.rchart {
			width: 100%;
			height: ptr(300px);
		}
	}
	.weatherBottom {
		text-align: center;
		.perText {
			padding: ptr(10px) 0;
			font-size: ptr(50px);
			color: #41C0C1;
		}
		.weatherName {
			color: #909090
		}
		.borderRight {
			border-right: 1px solid #E2E2E2;
		}
	}
	.selectType {
		height: ptr(80px);
		line-height: ptr(80px);
		margin: ptr(20px) 0;
		font-size: ptr(28px);
		color: #949494;
		text-align: center;
	}
	.rect {
		width: ptr(30px);
		height: ptr(30px);
		margin-right: ptr(10px);
		background-color: #82C3FD;
	}
	.selectYear {
		line-height: ptr(70px);
		height: ptr(70px);
		border: 2px solid #C6EFEF;
		border-radius: ptr(70px);
		color: #48C3C5;
	}
}
